useStorage

Hook for accessing the storage instance of the Sequence Connect client

Import

import { useStorage, useStorageItem } from '@0xsequence/connect'

Usage

import { useStorage, signEthAuthProof, validateEthProof } from '@0xsequence/connect'
import { useWalletClient, usePublicClient } from 'wagmi'

function App() {
  const { data: walletClient } = useWalletClient()
  const publicClient = usePublicClient()
  const storage = useStorage()
  
  const generateEthAuthProof = async () => {
    if (!walletClient || !publicClient || !storage) {
      return
    }
    
    try {
      // Use storage to generate an auth proof
      const proof = await signEthAuthProof(walletClient, storage)
      console.log('proof:', proof)
      
      const isValid = await validateEthProof(walletClient, publicClient, proof)
      console.log('isValid?:', isValid)
    } catch (e) {
      console.error(e)
    }
  }
  
  return (
    <button onClick={generateEthAuthProof}>
      Generate EthAuth Proof
    </button>
  )
}

Return Type

Storage<StorageItem> | null

Returns the Storage instance if available, or null if not configured.

useStorageItem

Hook to retrieve a specific item from the Sequence Connect storage.

Usage

import { useStorageItem } from '@0xsequence/connect'

function App() {
  const { data: authToken, isLoading } = useStorageItem('authToken')
  
  if (isLoading) {
    return <div>Loading...</div>
  }
  
  return (
    <div>
      {authToken ? 'Authenticated' : 'Not authenticated'}
    </div>
  )
}

Parameters

Parameter	Type	Description
key	keyof StorageItem	The key of the storage item to retrieve

Return Type

UseQueryResult<StorageItem[K]>

Returns a react-query result containing the storage item data, with the following properties:

Property	Type	Description
data	StorageItem[K]	The retrieved storage item data
isLoading	boolean	Whether the data is currently loading
isError	boolean	Whether an error occurred during data fetching
error	Error	The error object if an error occurred
…	…	Other react-query properties

Notes

These hooks provide access to the storage layer used by Sequence Connect for persisting authentication data, wallet state, and other client-side storage needs. The useStorage hook is commonly used for operations that require direct access to the storage layer, such as generating authentication proofs, while useStorageItem provides a convenient way to access specific items with react-query integration.